<template>
  <van-nav-bar
    left-text="返回"
    left-arrow
    @click-left="$router.back()"
    title="修改生日"
    placeholder
    fixed
  >
    <template #right>
      <van-button text type="primary" size="small" @click="onSubmit">保存</van-button>
    </template>
  </van-nav-bar>
  <van-form @submit="onSubmit">
    <van-cell-group>
      <!-- 生日选择 -->
      <van-field
        required
        v-model="newBirthday"
        is-link
        readonly
        name="生日"
        label="生日"
        placeholder="点击选择时间"
        :rules="[{ required: true, message: '请填写生日' }]"
        @click="birthdayShowPicker = true"
      />
      <van-popup v-model:show="birthdayShowPicker" destroy-on-close position="bottom">
        <van-date-picker
          :model-value="birthdayPickerValue"
          @confirm="birthdayonConfirm"
          @cancel="birthdayShowPicker = false"
          :min-date="new Date(1970, 1, 1)"
          :max-date="new Date()"
        />
      </van-popup>
    </van-cell-group>
  </van-form>
</template>

<script setup>
import { ref } from 'vue'
import { getUserInfoReq, userModifyReq } from '@/api/user'

let userInfo = ref({})
// 获取用户信息
function getUserInfo() {
  getUserInfoReq().then((res) => {
    // console.log(res.data.data)
    userInfo.value = res.data.data
    newBirthday.value = res.data.data.birthday
  })
}
getUserInfo()
// 修改年龄
let newBirthday = ref('')
let birthdayShowPicker = ref(false)
let birthdayPickerValue = ref([])
//生日选择器确认
function birthdayonConfirm({ selectedValues }) {
  newBirthday.value = selectedValues.join('/')
  birthdayPickerValue.value = selectedValues
  birthdayShowPicker.value = false
}
function onSubmit() {
  userModifyReq(
    newBirthday.value,
    userInfo.value.age,
    userInfo.value.value,
    userInfo.value.area,
    userInfo.value.address,
    userInfo.value.value,
    userInfo.value.gender,
  ).then((res) => {
    if (res.data.code === 1) {
      // eslint-disable-next-line no-undef
      showSuccessToast('修改成功')
      getUserInfo()
    } else {
      // eslint-disable-next-line no-undef
      showFailToast('修改失败')
    }
  })
}
</script>

<style scoped></style>
